<link href="${ctx}/shop/admin/spec/css/grid.css" rel="stylesheet" type="text/css" />
<style>
.spec_pic {
	border: 1px solid #3366CC;
	padding: 1px;
	vertical-align: middle;
}
</style>
<div class="main" style="background-color: white; overflow: hidden;">
	<div class="easyui-panel" style="border-style: none;">
		<form method="post" action="${ctx}/shop/admin/spec/save-add.do" class="validate"
			name="theForm" id="specEditForm">
			<div class="input">

				<table cellspacing="1" cellpadding="3" width="100%"
					class="form-table">
					<tr>
						<th><label class="text">规格名称：</label></th>
						<td><input type="text"  name="spec_name" maxlength="8" value="${specView.spec_name!''}"  data-options="required:true"  class="easyui-validatebox  input_text"/></td>
					</tr>
					<tr>
						<th><label class="text">规格备注：</label></th>
						<td><input type="text" name="spec_memo" maxlength="25" value="${specView.spec_memo!''}"  class="easyui-validatebox  input_text"/></td>
					</tr>
					<tr>
						<th><label class="text">显示类型：</label></th>
						<td><label>
								<input type="radio" value="0" name="spec_type"
									<#if specView.spec_type==0>checked</#if> >文字
							</label> 
							<label>
								<input type="radio" value="1" name="spec_type"<#if
									specView.spec_type==1>checked</#if> >图片
							</label>
						</td>
					</tr>

				</table>
			</div>
			<div class="grid" style="padding: 0px 20px 0px 40px; width: auto;">
				<div class="toolbar">

					<ul>
						<li><a id="addBtn" href="javascript:;" class="button ">添加规格值</a>
						</li>
						<li>&nbsp;&nbsp;<span class="help_icon" helpid="spec_add"></span>
						</li>
					</ul>

					<div style="clear: both"></div>
				</div>

				<table>
					<thead>
						<tr>
							<th>规格值名称</th>
							<th>&nbsp;</th>
							<th>操作</th>
						</tr>
					</thead>

					<tbody>
						<#if valueList??>
							<#list valueList as val>
							<tr>
								<td>
									<input type="text" name="valueArray"value="${val.spec_value }" class="input_text" maxlength="10"/> 
									<input type="hidden" name="valueIdArray" value="${val.spec_value_id }" />
								</td>
	
								<td>
									<#if val.spec_type == 1>
										<img height="30" width="30" src="${val.spec_image }" class="spec_pic">
										<#else>
										<img height="30" width="30" src="${ctx}/shop/admin/spec/image/spec_def.gif" class="spec_pic">
									</#if>
									 <span class="specImage"> 
										 <a href="javascript:;" class="sysbtn upload" img="${val.spec_image }">上传图片</a> 
										<input type="hidden" name="imageArray" value="${val.spec_image }" /> 
									</span>
								</td>
	
								<td>
									<a href="javascript:;">
										<img class="delete" src="${staticserver }/images/transparent.gif" valueid="0">
									</a>
								</td>
							</tr>
							</#list> 
						</#if>
					</tbody>
				</table>
			</div>
			<input type="hidden" name="spec_id" value="${specView.spec_id }">
		</form>
	</div>
</div>
	<table id="temp" style="display: none">
		<tr>
			<td><input type="text" name="valueArray" class="input_text" />
				<input type="hidden" name="valueIdArray" value="0" />
			</td>
			<td>
				<img height="30" width="30" src="${ctx}/shop/admin/spec/image/spec_def.gif" class="spec_pic">
				<span class="specImage"> <a href="javascript:;" class="sysbtn upload">上传图片</a> 
				<input type="hidden" name="imageArray" /> </span>
			</td>
			<td><a href="javascript:;"><img class="delete"
					src="${staticserver }/images/transparent.gif" valueid="0"> </a>
			</td>
		</tr>
	</table>

	<div id="upload"></div>
<script type="text/javascript">
	var imageInput;

	function uploadOk(data) {
		if (data.result == 1) {
			Spec.uploadOk(data.path);

		} else {
			alert(data.message);
		}
		Eop.Dialog.close("upload");
	}

	function getPath(path) {
		imageInput.parent().prev().attr("src", path);
		imageInput.val(path);
	}

	function addRow() {
		var tr = $("#temp tr").clone();
		if ($("input[value=]").attr("checked")) {

			tr.find("span.specImage").parent().children().hide();
		}
		var body = $(".grid table:first>tbody");
		$(".grid table:first>tbody").append(tr);

		$(".grid .sysbtn.upload").click(function() {
			self.imageInput = $(this).siblings("input");
			openImgDlg(getPath);
		});
	}

	$(function() {

		$("span.specImage").parent().children().hide();

		if ("${specView.spec_type}" == 1) {
			$("span.specImage").parent().children().show();
		}

		$(".upload").click(function() {
			self.imageInput = $(this).siblings("input");
			openImgDlg(getPath);
		});

		$("input[value=1]").click(function() {
			$("span.specImage").parent().children().show();
		});

		$("input[value=0]").click(function() {
			$("span.specImage").parent().children().hide();
		});

		$("#addBtn").click(function() {
			addRow();
		});

		$(".grid table .delete").click(function() {
			var $this = $(this);
			var valueid = $this.attr("valueid");
			if ("0" == valueid) {
				deleteRow($this);
			} else {
				$.ajax({
					url : "${ctx}/shop/admin/spec/check-value-used.do?valueid="+ valueid,
					dataType : "json",
					success : function(result) {
						if (result.result == 1) {
							alert("此规格正在被商品使用，不能删除");
						} else {
							deleteRow($this);
						}
					},
					error : function() {
						alert("抱歉检测规格是否使用出错!");
					}
				});
			}
		});
	});

	function deleteRow(link) {
		link.parent().parent().parent().remove();
	}
</script>
